<head>
	<meta name="viewport" content="width=device-width" />
	<script src="../jquery.js" type="text/javascript" charset="utf-8"></script>	
	<script type="text/javascript" charset="utf-8">
		function positionFound(position) {
			$("#status").html("Location found; reverse geocoding...");
			var lat = position.coords.latitude;
			var lon = position.coords.longitude;
			$.getJSON("http://tinygeocoder.com/create-api.php?callback=?", {'g': lat+','+lon}, function(data){
				$("#status").hide();
				$("#result").html("" + data);
			})
		}
		$(document).ready(function(){
			$("#status").html("Finding location...");
			if(navigator.geolocation) {
				navigator.geolocation.getCurrentPosition(positionFound);
			} else {
				// fake it
				window.setTimeout(function(){
					positionFound({'coords':{'latitude':37.428337, 'longitude':-122.175822}})
				}, 2500);
			}
		})
	</script>
</head>
<body>
	<div id="status"> </div>
	<div id="result"> </div>
</body>